<template>
  <q-layout>
    <q-layout-header ref="header">
      <xheader :title="title"></xheader>
    </q-layout-header>
    <q-page-container>
      <xscrollarea :scroll-height="scrollHeight">
        <q-page padding>
          <q-select
            v-model="planCode"
            float-label="计划编码"
            filter
            :options="planCodeOptions" clearable
          />
          <q-select
            v-model="facCode"
            float-label="设备编码"
            :options="facCodeOptions" clearable
          />
          <div v-show="data.length">
            <br>
            <q-card>
              <q-card-title>
                设备名称:{{name}}
                <div slot="subtitle">
                  车间:{{bzName}}<br>
                  设备责任人:{{yhName}}
                  点检周期:{{cycles}}
                </div>
              </q-card-title>
              <q-card-main>
                <q-card-separator v-for="(d,index) in data" v-if="index!==0"/>
                <q-item v-for="d in data">
                  <q-item-main>
                    <q-checkbox v-model="d.checked" label="勾选完成" left-label/>
                    <div class="row">
                      <div class="col"><p>点检项目名称：</p></div>
                      <div class="col"><p>{{d.DJNAME}}}}</p></div>
                    </div>
                    <div class="row">
                      <div class="col"><p>点检项目标准：</p></div>
                      <div class="col"><p>{{d.STANDARDS}}}}</p></div>
                    </div>
                    <div class="row">
                      <div class="col"><p>点检方式：</p></div>
                      <div class="col"><p>{{d.MODES}}}}</p></div>
                    </div>
                    <div class="row">
                      <div class="col"><p>点检结果：</p></div>
                      <div class="col"><p>{{d.DJNAME}}}}</p></div>
                    </div>
                    <q-radio v-model="d.option" val="normal" label="正常"/>
                    <q-radio v-model="d.option" val="abnormal" label="异常"/>
                    <q-input float-label="处理结果" v-model="d.workflowrank" type="textarea" rows="1"/>
                    <q-input float-label="备注" placeholder="选填" v-model="d.remark" type="textarea" rows="1"/>
                  </q-item-main>
                </q-item>

              </q-card-main>

            </q-card>
          </div>
        </q-page>
      </xscrollarea>
    </q-page-container>
    <q-layout-footer ref="footer">
      <q-toolbar color="primary" v-show="data.length">
        <q-toolbar-title>
        </q-toolbar-title>
        <!--<q-btn label="全选"/>&nbsp;&nbsp;-->
        <q-btn label="提交" @click="submit"/>
      </q-toolbar>
    </q-layout-footer>
  </q-layout>
</template>

<script>

import utils from '../../js/utils'
import Xheader from '../../components/xheader'
import Xscrollarea from '../../components/xscrollarea'

export default {
  name: 'equipment_inspection',
  components: { Xscrollarea, Xheader },
  props: {
    title: {}
  },
  data: () => ({
    scrollHeight: 0,
    planCode: '',
    planCodeOptions: [],
    facCode: '',
    facCodeOptions: [],
    name: '',
    bzName: '',
    yhName: '',
    cycles: '',
    data: []
  }),
  computed: {},
  watch: {
    planCode () {
      this.getFacCodeOptions()
    },
    facCode () {
      this.getInfo()
    }
  },
  methods: {
    initPlanData () {
      this.axios.post(this.$conf.server + '/equipmentInspection/initProcessInfo', {}).then(res => {
        if (res.data.result) {
          for (let v of res.data.Plans) {
            this.planCodeOptions.push({ value: v.CODE, label: v.CODE + '-' + v.BEIZHU })
          }
        }
      })
    },
    getFacCodeOptions () {
      this.data = []
      this.name = ''
      this.bzName = ''
      this.yhName = ''
      this.facCodeOptions = []
      if (this.planCode !== '') {
        this.axios.post(this.$conf.server + '/equipmentInspection/equipmentProcessInfo.html',
          this.$qs.stringify({ CODE: this.planCode })).then(res => {
          if (res.data.result) {
            for (let v of res.data.failices) {
              this.facCodeOptions.push({ value: v.SHEBEICODE, label: v.SHEBEICODE })
            }
          }
        })
      }
    },
    getInfo () {
      if (this.facCode !== '') {
        this.data = []
        this.name = ''
        this.bzName = ''
        this.yhName = ''
        this.cycles = ''
        this.axios.post(this.$conf.server + '/equipmentInspection/Spotcheckinformation.html',
          this.$qs.stringify({
            PLANCODE: this.planCode,
            CODE: this.facCode
          })).then(res => {
          if (res.data.result) {
            if (res.data.information && res.data.information.length) {
              this.data = res.data.information
              this.name = this.data[0].SBNAME
              this.bzName = this.data[0].FCNAME
              this.yhName = this.data[0].YHNAME
              this.cycles = this.data[0].CYCLES
              for (let d of this.data) {
                // d.option = 'normal'
                this.$set(d, 'option', 'normal')
                this.$set(d, 'checked', false)
              }
              this.$nextTick(() => {
                this.changeScrollHeight()
              })
            } else {
              this.$parent.info(`计划编码为${this.planCode}下的${this.facCode}设备无保养项目！`)
            }
          }
        })
      }
    },
    changeScrollHeight () {
      this.scrollHeight = this.$parent.webHeight - this.$refs.header.$el.clientHeight - this.$refs.footer.$el.clientHeight
    },
    submit () {
      let chestr = ''
      let remarks = ''
      let workflowranks = ''
      let options = ''
      for (let d of this.data) {
        if (d.checked) {
          chestr += d.DJCODE + ','
          remarks += utils.nvl(d.remark) + ','
          workflowranks += utils.nvl(d.workflowrank) + ','
          options += utils.nvl(d.option) + ','
        }
      }
      this.axios.post(this.$conf.server + '/equipmentInspection/EquipmentPreservation',
        this.$qs.stringify({
          Remarks: workflowranks,
          CODE: this.facCode,
          PLANCODE: this.planCode,
          CHESTR: chestr,
          user: this.yhName,
          CYCLES: this.cycles,
          Radios: options,
          DESCRIPTION: remarks
        }))
        .then(res => {
          if (res.data.results === 'false') {
            this.$parent.info('处理失败')
          } else {
            this.$parent.info('处理成功')
            this.planCode = ''
            this.facCode = ''
            this.facCodeOptions = []
            this.name = ''
            this.bzName = ''
            this.yhName = ''
            this.cycles = ''
            this.data = []
          }
        })
    }
  },
  mounted () {
    this.scrollHeight = this.$parent.webHeight - this.$refs.header.$el.clientHeight
  },
  created () {
    this.initPlanData()
  }
}
</script>

<style scoped>

</style>
